<template>
  <!-- `checked` 为 true 或 false -->
  <div>
    <el-checkbox v-model="checked" @change="choosedCheckBox">我已年满18岁,已阅读并接受</el-checkbox>
    <span class="redColor" @click="showfile">《服务协议》</span>
    <div class="textbox" v-if="showAgreement">
      <img src="../assets/imgs/close.png" alt="" @click="closefile">
      <p v-html="filedata.content">
        <!-- {{filedata.content}} -->
      </p>
    </div>
  </div>
  
</template>
<script>
export default {
  props:{
    isCheckedFalse:{
      type:Boolean
    }
  },
  watch:{
    isCheckedFalse(){
      this.checked = false;
    }
  },
  data() {
    return {
      checked: false,
      showAgreement:false,
      filedata:''    //服务协议文本
    };
  },
  mounted(){
    this.axios.post('user/getObtainServiceAgreement').then(res=>{
      this.filedata = res.data.data
    })
  },
  methods:{
    choosedCheckBox(){
      // if(this.checked){
        this.$emit('checkBoxChecked',this.checked);
      // }
    },
    showfile(){
      this.showAgreement = true;
    },
    closefile(){
      this.showAgreement = false;
    }
  }
};
</script>

<style lang="less">
@import url(../assets/css/checkbox.less);
</style>
